import {createRouter, createWebHashHistory} from 'vue-router'

const Home = () => import('../components/Home.vue')
const TodoList = () => import('../components/TodoList.vue')
const Zidingyi = () => import('../components/v-model/index.vue')
const Emit = () => import('../components/v-model/zidingyi.vue')
const VModel = () => import('../components/v-model/v-model.vue')
const Slot = () => import('../components/Slots/slot.vue')
const ProvideOrInject = () => import('@/components/ProvideOrInject/ProvideOrInject.vue')

const routes = [
  {
    path: '/',
    redirect: '/home',
    meta: {
      isMenu: false
    }
  },
  {
    path: '/home',
    component: Home,
    meta: {
      isMenu: true,
      title: '首页',
      icon: 'el-icon-s-home'
    }
  },
  {
    path: '/todo',
    component: TodoList,
    meta: {
      isMenu: true,
      title: 'todo-list',
      icon: 'el-icon-tickets'
    }
  },
  {
    path: '/zidingyi/',
    component: Zidingyi,
    meta: {
      isMenu: true,
      title: '自定义事件',
      icon: 'el-icon-notebook-1'
    },
    children: [
      {
        path: 'emit',
        component: Emit,
        meta: {
          isMenu: true,
          title: 'emit',
          icon: 'el-icon-menu'
        }
      },
      {
        path: 'emit-false',
        component: Emit,
        meta: {
          isMenu: false,
          title: 'emit'
        }
      },
      {
        path: 'v-model',
        component: VModel,
        meta: {
          isMenu: true,
          title: 'v-model',
          icon: 'el-icon-menu'
        }
      }
    ]
  }, {
    path: '/slot',
    component: Slot,
    meta: {
      isMenu: true,
      title: 'slot插槽',
      icon: 'el-icon-edit-outline'
    }
  }, {
    path: '/provide-inject',
    component: ProvideOrInject,
    meta: {
      isMenu: true,
      title: 'Provide & Inject',
      icon: 'el-icon-edit-outline'
    }
  }
]

const router = createRouter({
  history: createWebHashHistory(),
  routes
})

export default router
